import './index.scss';
import {Table, Button, message, Modal} from 'antd';
import React, { useState } from 'react';
import market from "../../../store/Market/market";
import {useNavigate} from 'react-router-dom'
import store from "../../../store";
import {observer} from 'mobx-react'
const MarketingList=()=>{
    const navigate = useNavigate();
    const goDetailM = ()=>{navigate('/home/CouponManagement/goDetailM')};
    const [selectionType, setSelectionType] = useState('checkbox');
    //删除表格数据模态框
    const [isDeletModalO, setisDeletModalO] = useState(false)
    const [checkId,setCheckId]=useState()
    //多选
    const onSelectChange = (selectedRowKeys, selectedRows, {type}) => {
        store.market.setSelectRowKeys(selectedRowKeys)
    }
    //删除表格数据-模态框
    const DeleteList = (val) => {
        setisDeletModalO(true);
        console.log("此条数据内容:", val);
        setCheckId(val)
    }
    //删除表格数据模态框-确认
    const deletOk = () => {
        setisDeletModalO(false);
        let arr=[...store.market.count]
        console.log(arr)
        arr.forEach((v,i)=>{
            console.log(v.id,checkId)
            if (v.id===checkId){
                arr.splice(i,1)
                console.log(arr)
                store.market.setMemberTableList(arr)
                message.success('删除该条数据成功')
            }
        })


    };
    //删除表格数据模态框-取消
    const deletCancel = () => {
        setisDeletModalO(false);
    };
    const columns = [
        {
            title: '操作时间',//表格列名
            dataIndex: 'operationTime',//对应数据字段
            key: 'operationTime',//该列的唯一值
        },
        {
            title: '操作人',
            dataIndex: 'operationName',
            key: 'operationName',
        },
        {
            title: '营销类型',
            dataIndex: 'marketingType',
            key: 'marketingType',
        },
        {
            title: '营销详情',
            dataIndex: 'marketingDetails',
            key: 'marketingDetails',
        },
        {
            title: '状态',
            dataIndex: 'status',
            key: 'status',
        },
        {
            title: '操作',
            render:(_,record)=>(
                <Button type={"link"} onClick={() =>{
                    DeleteList(record.id)}}>删除</Button>
            )

        },
    ];
    const data= store.market.count
    return <div>
        <Table
            rowSelection={{
                type: selectionType,
                onChange: onSelectChange,
            }}
            columns={columns}
            dataSource={data}
            rowKey={(record) => record.id}
            pagination={{pageSize:5}}/>
        <Modal
            title="删除此条数据"
            open={isDeletModalO}
            onOk={deletOk}
            okText={"确定"}
            onCancel={deletCancel}
            cancelText={"取消"}
        >
            <p>确定删除该条数据吗？</p>
        </Modal>
    </div>
}
export default observer(MarketingList);